import React from 'react';
import {
    Button, Select, Space, Modal,
    Form, Checkbox, notification,
    Input, InputNumber, message,
} from 'antd';
import {
    ExclamationCircleOutlined
} from '@ant-design/icons';
import { connect } from 'umi';
import * as Request from '@/services/Request';
import { WhseSelect } from '@/components/FormItemSelect';
import ItemSelect from '@/components/ItemSelect';

const { confirm } = Modal;
const apiURL = "/api/services/app/ShipDtl/";
const currentControl = "ShipDtl";
class ViewPage extends React.Component<any, any> {
    constructor(props: any) {
        super(props);
        this.state = {
            loading: false,
            visible: false,
            data: {},
        }
    }
    formRef: any = React.createRef();
    componentDidMount() {
        this.props.onRef(this)
        if (this.props.data) {
            this.setState({ data: this.props.data })
            this.formRef.current.setFieldsValue({ model: this.props.data });
        }
    }
    onFinish = (values: any) => {
        this.save(values.model)
    }
    save = (model: any) => {
        var act = 'New'
        var method = 'POST'
        if (model.id) {
            act = 'Modify'
        }
        Request.post(apiURL + act, model, method).then((response) => {
            if (response) {
                if (response.success) {
                    message.success('保存成功！');
                    this.props.refreshData(model.packNum)
                }
                else {
                    notification.error({
                        message: response.error.message,
                        description: response.error.details,
                    });
                }
                this.setState({ loading: false });
            }
        });
    }
    setCurrent = (item: any) => {
        //var obj = this.formRef.current.getFieldsValue();
        let model = {
            orderNum: item.orderNum,
            orderLine: item.orderLine,
            orderRelNum: item.orderRelNum,
            partNum: item.partNum,
            partDescription: item.lineDesc,
            ium: item.ium,
            ourJobShipQty: item.ourReqQty,
        }
        this.formRef.current.setFieldsValue({ model });
    }
    delObj = () => {
        const { data } = this.state;
        let _this = this
        confirm({
            title: '警告',
            icon: <ExclamationCircleOutlined />,
            content: '删除后将不可恢复，确定删除？',
            onOk() {
                _this.props.dispatch({
                    type: 'Abp/delete',
                    payload: { id: data.id },
                    control: currentControl
                }).then(() => {
                    _this.props.refreshData(data.packNum)
                })
            },
        });

    }
    render() {
        const layout = {
            labelCol: { span: 5 },
            wrapperCol: { span: 17 },
        };
        const columnOrderRel = [
            {
                title: '订单号',
                dataIndex: 'orderNum',
            },
            {
                title: '分录',
                dataIndex: 'orderLine',
            },
            {
                title: '发货行',
                dataIndex: 'orderRelNum',
            },
            {
                title: '物料编码',
                dataIndex: 'partNum',
            },
            {
                title: '描述',
                dataIndex: 'lineDesc',
            },
            {
                title: '需求量',
                dataIndex: 'ourReqQty',
            },
            {
                title: '单位',
                dataIndex: 'ium',
            },
        ]
        return (
            <Form {...layout} ref={this.formRef} onFinish={this.onFinish} >
                <Form.Item name={['model', 'id']} hidden={true}>
                    <Input />
                </Form.Item>
                <Form.Item label="出货单号" name={['model', 'packNum']} rules={[{ required: true }]}>
                    <Input disabled />
                </Form.Item>
                <Form.Item label="出货行" name={['model', 'packLine']}>
                    <InputNumber disabled />
                </Form.Item>
                <Form.Item label="销售单">
                    <Input.Group compact>
                        <Form.Item
                            noStyle
                            name={['model', 'orderNum']}
                            rules={[{ required: true, message: '销售单号必填' }]}>
                            <Input style={{ width: 80 }} placeholder="销售单号" />
                        </Form.Item>
                        <Form.Item noStyle name={['model', 'orderLine']}
                            rules={[{ required: true, message: '分录必填' }]}>
                            <InputNumber placeholder="分录"  style={{ width: 80 }} />
                        </Form.Item>
                        <Form.Item noStyle name={['model', 'orderRelNum']}
                            rules={[{ required: true, message: '出货行必填' }]}>
                            <InputNumber placeholder="出货行"  style={{ width: 80 }} />
                        </Form.Item>
                        <Form.Item noStyle>
                            <ItemSelect
                                width={780}
                                control='OrderHed'
                                columns={columnOrderRel}
                                text="选择"
                                title="销售订单"
                                act="getItems"
                                btntype="primary"
                                setCurrent={this.setCurrent} />
                        </Form.Item>
                    </Input.Group>
                </Form.Item>
                <Form.Item label="物料编码">
                    <Input.Group compact>
                        <Form.Item
                            noStyle
                            name={['model', 'partNum']}
                            rules={[{ required: true, message: "请输入物料编码" }]}>
                            <Input style={{ width: 150 }} />
                        </Form.Item>
                        <Form.Item noStyle name={['model', 'ium']}>
                            <Input style={{ width: 80 }} placeholder="单位" />
                        </Form.Item>
                    </Input.Group>
                </Form.Item>
                <Form.Item name={['model', 'partDescription']} label="物料描述" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name={['model', 'ourJobShipQty']} label="出货数量" rules={[{ required: true }]}>
                    <InputNumber />
                </Form.Item>
                <Form.Item label="出货位置" style={{ marginBottom: 0 }}>
                    <Input.Group compact>
                        <WhseSelect width={120} required={true} showSearch={false} name={['model', 'warehouseCode']} placeholder="出货仓库" />
                        <Form.Item name={['model', 'binNum']} rules={[{ required: true, message: "出货库位必填" }]}>
                            <Input style={{ width: 100 }} placeholder="库位" />
                        </Form.Item>
                        <Form.Item name={['model', 'lotNum']}>
                            <Input style={{ width: 100 }} placeholder="批次号" />
                        </Form.Item>
                    </Input.Group>
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 5 }}>
                    <Input.Group compact>
                        <Form.Item
                            name={['model', 'shipCmpl']}
                            valuePropName="checked">
                            <Checkbox>完成出货</Checkbox>
                        </Form.Item>
                        <Form.Item
                            name={['model', 'invoiced']}
                            valuePropName="checked">
                            <Checkbox disabled>已开票</Checkbox>
                        </Form.Item>
                    </Input.Group>
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 5 }}>
                    <Space>
                        <Button key="1" type="primary" htmlType="submit">保存</Button>
                        <Button key="2" danger disabled={!this.state.data.id} onClick={this.delObj}>删除</Button>
                    </Space>
                </Form.Item>
            </Form>
        )
    }
}
export default connect(({ Abp, Warehse }: API.IConnectState) => ({
    response: Abp.response,
    currentUser: Abp.currentUser,
    warehses: Warehse.items,
}))(ViewPage);